<template>
	<view class="index">
		<view class="bg_image">
			<image src="http://wx-cdn.jiujiuyunhui.com/202011091623282f83a8213.png"></image>
		</view>
		<view class="certification">
			<view class="" v-if="verify_status !== '1'">
				<view class="iconfont" style="font-size: 40rpx;color: red;margin-bottom: 2rpx;"
					v-if="verify_status == '2'">
					已驳回
				</view>
				<view class="" v-if="verify_status == '2'">
					驳回原因： {{reject_reason}}
				</view>
				<!-- 				<view class="" v-if="verify_status == '2'">
				</view> -->
				<view class="iconfont" style="font-size: 40rpx;margin-bottom: 2rpx;color: #000000;"
					v-if="verify_status == '0'">
					审核中
				</view>
				<view class="iconfont" style="font-size: 40rpx;margin-bottom: 2rpx;color: green;"
					v-if="verify_status == '1'">
					审核已通过，请前往认证
				</view>
			</view>
			<form @submit="formSubmit" @reset="formReset">
				<view class="certification_head">
					<view class="certification_head_body">
						<view class="certification_head_body_item">
							<view class="icon iconfont icon-qiye"></view>
							<input type="text" name="shop_name" v-model="form.shop_name" :disabled="disabled"
								placeholder='请输入店铺名称' />
						</view>
						<view class="certification_head_body_item">
							<view class="icon iconfont icon-ziyuan1"></view>
							<input type="text" name="name" v-model="form.name" :disabled="disabled"
								placeholder='请输入真实姓名' />
						</view>
						<view class="certification_head_body_item">
							<view class="icon iconfont icon-phone"></view>
							<input type="text" name="mobile" v-model="form.mobile" :disabled="disabled"
								placeholder='请输入手机号码' />
							<!-- <button type="default"  v-if="sms_open == 1" :disabled="is_send" @click="getCode(form.mobile)" style="color: #00C8BE; border-color: #00C8BE;">{{send_btn_txt}}</button> -->
						</view>
						<view class="certification_head_body_item">
							<!-- <view class="icon iconfont icon-ziyuan1"></view> -->
							<view class="icon iconfont icon-yanzhengma"></view>
							<input type="text" name="sales_id" v-model="form.sales_id" :disabled="disabled"
								placeholder='请输入推荐业务员编号' />
						</view>
						<view class="certification_head_body_item">
							<!-- <view class="icon iconfont icon-ziyuan1"></view> -->
							<view class="icon iconfont icon-yanzhengma"></view>
							<input type="text" name="license_no" v-model="form.license_no" :disabled="disabled"
								placeholder='请输入营业执照号' />
						</view>
						<!-- <view class="certification_head_body_item" v-if="sms_open == 1">
							<view class="icon iconfont icon-yanzhengma"></view>
							<input type="text" name="code" v-model="form.code" placeholder='请输入验证码' />
						</view> -->
						<!-- 				<picker class="" value="" @change="changeSelect($event)"
							:range="classify_data_name">
							<view class="certification_head_body_item d-b-c">
								<view class="make-item input-box flex-1" v-if="classify_data_name_active">{{classify_data_name_active}}</view>
								<view class="make-item input-box flex-1" style="color: #777777;" v-else>请选择您店铺的主营项目</view>
								<view class="icon iconfont icon-jiantou" style="font-size: 24rpx;"></view>
							</view>
						</picker> -->

					</view>
				</view>
				<view class="certification_body">
					<view class="login_index_updata_name">
						<text style="color:#00C8BE;">*</text>
						<text style="font-size: 32rpx;font-weight: 500;color: #000000;">请上传营业执照</text>
					</view>
					<view class="login_index_updata_updata">
						<view class="login_index_updata_updata_item2" @click="openUpload()">
							<view class="login_index_updata_updata_item_body">
								<view v-if="business_id_path!=''" class="img">
									<image :src="business_id_path"></image>
								</view>
								<view v-if="business_id_path==''">点击上传营业执照</view>
								<input style="display:none" name="license_pic" v-model="form.license_pic" />
							</view>
						</view>
					</view>
				</view>
				<view class="">

					<view class="login_index_btn" v-if="verify_status == '1'">
						<button type="default" style="background-color: #00C8BE;" @click="faceStates()">去认证</button>
					</view>
					<view class="login_index_btn" v-else>
						<button form-type="submit" type="default" style="background-color: #00C8BE;">确定</button>
					</view>
				</view>

				<Upload v-if="isupload" :isupload="isupload" :type="type" @getImgs="getImgsFunc">上传图片</Upload>
			</form>
		</view>
	</view>
</template>

<script>
	import Upload from '@/components/upload/uploadOne';
	export default {
		components: {
			/*编辑组件*/
			Upload
		},
		onShow() {
			/*获取个人中心数据*/
			this.getData();
		},
		data() {
			return {
				form: {
					// image_frontid: 0,
					// business_id: 0,
					// mobile: '',
					// password: '',
					name: '', // 姓名
					mobile: '', // 手机号	
					user_id: '', // 用户id
					sales_id: '', // 业务员id
					shop_name: '', // 店铺名称	
					license_no: '', // 营业执照号
					license_pic: '' // 营业执照照片
				},
				isupload: false,
				type: 'frontid',
				image_frontid_path: '',
				business_id_path: '',
				// business_id:0,
				bg_image: '',
				classify_data_name: '', //列表名字
				classify_data_id: '', //列表id
				classify_data_name_active: '', //当前选中的列表名字
				classify_data_id_active: '', //当前选中的列表id
				/*当前秒数*/
				second: 60,
				send_btn_txt: '获取验证码',
				/*是否已发验证码*/
				is_send: false,
				sms_open: 0,
				verify_status: '',
				disabled: true,
				userId: '',
				reject_reason: '',
				shop_supplier_id: '1'
			}
		},
		// onShow() {
		// 	// this.get_classify();
		// 	this.getData()
		// },
		methods: {
			/*改变发送验证码按钮文本*/
			changeMsg() {
				if (this.second > 0) {
					this.send_btn_txt = this.second + '秒';
					this.second--;
					setTimeout(this.changeMsg, 1000);
				} else {
					this.send_btn_txt = '获取验证码';
					this.second = 60;
					this.is_send = false;
				}
			},
			/*获取数据*/
			getData() {
				let self = this;
				self._get('user.index/detail', {

				}, function(res) {
					self.form.user_id = res.data.userInfo.user_id;
					self.getDataUser()

				});
			},
			getDataUser() {
				let self = this;
				self._post('user.user_promotion/info', {

				}, function(res) {
					console.log(res)
					if (res.data.data !== null) {
						self.form.name = res.data.data.name // 姓名
						self.form.mobile = res.data.data.mobile // 手机号
						self.form.user_id = res.data.data.user_id // 用户id
						self.form.sales_id = res.data.data.sales_id // 业务员id
						self.form.shop_name = res.data.data.shop_name, // 店铺名称
							self.form.license_no = res.data.data.license_no, // 营业执照号
							self.form.license_pic = res.data.data.license_pic // 营业执照照片
						self.business_id_path = res.data.data.license_pic
						// 审核 verify_status
						self.verify_status = res.data.data.verify_status
						if (self.verify_status == '2') {
							self.disabled = false
							self.userId = res.data.data.id
							self.reject_reason = res.data.data.reject_reason
						} else {
							self.disabled = true
						}
					} else {
						self.disabled = false
					}
				});
			},
			//获取验证码
			// getCode(mobile) {
			// 	let self = this;
			// 	self._post('supplier.apply/sendCode', {
			// 		mobile: mobile
			// 	}, function(res) {
			// 		self.is_send = true;
			// 		self.changeMsg();
			// 	});
			// },
			//获取分类
			// get_classify() {
			// 	let self = this;
			// 	self._post('supplier.apply/category', {

			// 	}, function(res) {
			// 		let list_name = [];
			// 		let list_id = [];
			// 		//合成select列表
			// 		for (var i = 0; i < res.data.list.length; i++) {
			// 			list_name.push(res.data.list[i].name);
			// 		}
			// 		//合成上传所需id数组
			// 		for (var i2 = 0; i2 < res.data.list.length; i2++) {
			// 			list_id.push(res.data.list[i2].category_id);
			// 		}
			// 		self.classify_data_name = list_name;
			// 		self.classify_data_id = list_id;
			// 		self.sms_open = res.data.sms_open;
			// 	});
			// },
			// //选择分类
			// select() {
			// 	let self = this;
			// 	uni.showActionSheet({
			// 		itemList: self.classify_data_name,
			// 		success: function(res) {
			// 			self.classify_data_name_active = self.classify_data_name[res.tapIndex];
			// 			self.classify_data_id_active = self.classify_data_id[res.tapIndex];
			// 		},
			// 		fail: function(res) {

			// 		}
			// 	});
			// },
			// 人脸认证
			faceStates: function() {
				console.log(111)
				// let self = this;
				// self._post('user.user_promotion/faceStates',{}, function(res) {
				// 	// self.showSuccess(res.msg, function() {
				// 	// self.gotoPage('/pages/shop/application_status')
				// 	// }, null, function() {
				// 		console.log('点击了确定',res.data.face_verify);
				// 		if (res.data.face_verify == 0) {
				// 			self._post('user.user_promotion/faceAuthentication',{}, function(res) {
				// 				console.log(res)
				// 			});
				// 		} else{

				// 		}
				// 	// });
				// });
				uni.navigateTo({
					url: '/pages/shop/smrz'
				})
			},
			/*提交*/
			formSubmit: function(e) {
				let self = this;
				if (self.disabled == true) return
				var formdata = e.detail.value;
				formdata.user_id = self.form.user_id;
				// console.log(formdata)
				// formdata.category_id = self.classify_data_id_active;
				// if (self.classify_data_name_active == '') {
				// 	uni.showToast({
				// 		title: '请填主营类别',
				// 		duration: 1000,
				// 		icon: 'none'
				// 	});
				// 	return false;
				// }
				if (formdata.shop_name == '') {
					uni.showToast({
						title: '请输入店铺名称',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}
				if (formdata.name == '') {
					uni.showToast({
						title: '请输入真实姓名',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}



				if (formdata.mobile == '') {
					uni.showToast({
						title: '请输入手机号码',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}
				// if (formdata.code == '' && self.sms_open == 1) {
				// 	uni.showToast({
				// 		title: '请填写验证码',
				// 		duration: 1000,
				// 		icon: 'none'
				// 	});
				// 	return false;
				// }
				// if (formdata.password == '') {
				// 	uni.showToast({
				// 		title: '请填写登录密码',
				// 		duration: 1000,
				// 		icon: 'none'
				// 	});
				// 	return false;
				// }

				let reg = /^((0\d{2,3}-\d{7,8})|(1[3456789]\d{9}))$/;
				if (!reg.test(formdata.mobile)) {
					uni.showToast({
						title: '手机号码格式不正确',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}
				if (formdata.sales_id == '') {
					uni.showToast({
						title: '请填写业务员编号',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}
				if (formdata.license_no == '') {
					uni.showToast({
						title: '请填写营业执照号',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}
				if (formdata.license_pic == '') {
					uni.showToast({
						title: '请上传营业执照',
						duration: 1000,
						icon: 'none'
					});
					return false;
				}
				uni.showLoading({
					title: '正在提交',
					mask: true
				})
				if (self.verify_status == '2') {
					formdata.id = self.userId;
					formdata.shop_supplier_id = self.shop_supplier_id
					console.log(formdata)
					self._post('user.user_promotion/edituser', formdata, function(res) {
						// self.showSuccess(res.msg, function() {
						// self.gotoPage('/pages/shop/application_status')
						// }, null, function() {
						self.getDataUser()
						uni.hideLoading();
						// });
					});
				} else {
					self._post('user.user_promotion/add', formdata, function(res) {
						// self.showSuccess(res.msg, function() {
						// self.gotoPage('/pages/shop/application_status')
						// }, null, function() {
						self.getDataUser()
						uni.hideLoading();
						// });
					});
				}

			},
			/*上传*/
			openUpload(e) {
				if (this.disabled == false) {
					this.isupload = true;
				}
			},

			/*获取图片*/
			getImgsFunc(e) {
				console.log(e)
				// if (e != null && e.length > 0) {
				// if (this.type == 'frontid') {
				// console.log(e[0].file_id);
				// this.image_frontid_path = e[0].file_path;
				// this.form.image_frontid = e[0].file_id;
				// } else if (this.type == 'license') {
				// 	console.log(e[0].file_id);
				this.business_id_path = e[0].file_path;
				this.form.license_pic = e[0].file_path
				// }
				// }
				// this.isupload = false;
			},
			/* 下拉框 */
			changeSelect(e) {
				this.classify_data_id_active = this.classify_data_id[e.detail.value];
				this.classify_data_name_active = this.classify_data_name[e.detail.value];
			},
		}
	}
</script>

<style>
	page {
		background: rgba(0, 200, 190, 0.1);
	}

	.bg_image image {
		width: 100%;
		height: 1200rpx;
	}

	.iconfont {
		font-size: 48rpx;
	}

	.index {
		width: 750rpx;
	}

	.certification {
		width: 675rpx;
		margin: 0 auto;
		border-radius: 30rpx;
		padding: 30rpx;
		box-sizing: border-box;
		background-color: white;
		position: absolute;
		top: 240rpx;
		left: 37.5rpx;
		margin-bottom: 50rpx;
	}

	.certification_head {
		width: 100%;
	}

	.certification_head_body {
		width: 100%;
	}

	.certification_head_body_item {
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
		font-size: 32rpx !important;
	}

	.certification_head_body_item view {
		margin-right: 10rpx;
	}

	.certification_head_body_item button {
		width: 172rpx;
		height: 56rpx;
		line-height: 56rpx;
		border: 1rpx #E2231A solid;
		border-radius: 40rpx;
		font-size: 26rpx;
		color: #E2231A;
		padding: 0 20rpx;
	}

	.certification_body {}

	.login_index_updata_name {
		margin-top: 28rpx;
		margin-left: 48rpx;
	}

	.login_index_updata_updata {
		width: 90%;
		height: 360rpx;
		margin: 0 auto;
		margin-top: 35rpx;
	}

	.login_index_updata_updata_item2 {
		width: 100%;
		height: 360rpx;
		border: 1rpx #9a9a9a dotted;
		border-radius: 15rpx;
		text-align: center;

	}

	.login_index_updata_updata_item_body {
		width: 150rpx;
		height: 360rpx;
		text-align: center;
		margin: 0 auto;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.img image {
		width: 554rpx;
		height: 360rpx;
		position: relative;
	}

	.login_index_btn {
		position: relative;
		top: 30rpx;
		margin-bottom: 30rpx;
	}

	.login_index_btn button {
		width: 90%;
		height: 80rpx;
		background-color: #F36A24;
		border-radius: 50rpx;
		line-height: 80rpx;
		margin: 0 auto;
		color: white;
		font-size: 30rpx;
	}

	.certification_rule {
		position: relative;
		left: 500rpx;
		top: -10rpx;
	}

	.certification_rule text {
		color: #8a8a8a;
	}

	.certification_rule image {
		width: 24rpx;
		height: 24rpx;
		display: inline-block;
	}

	.classify_text {
		color: #808080;
		margin-left: 40rpx;
	}

	.select input {
		padding-left: 60rpx;
		color: #808080;
	}

	.make-item {
		padding-left: 60rpx;
	}
</style>